<!-- 签到 -->
<template>
  <el-card>
    <el-row>
      <el-form ref="form" :model="searchDto" inline label-suffix=":">
        <el-form-item label="关键字" prop="keywords">
          <el-input
            v-model="searchDto.keywords"
            placeholder="请输入关键字"
            style="width: 250px"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" type="primary" @click="search"
            >查询</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-s-open" type="primary" @click="clear"
            >重置</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button @click="$router.go(-1)">返回</el-button>
        </el-form-item>
      </el-form>
    </el-row>

    <page-table
      ref="recovery"
      :page-data="pageData"
      :loading="loading"
      :do-get-page-data="getPageData"
    >
      <el-table-column type="index" label="编号" width="80" align="center" />
      <el-table-column prop="recoveryName" label="学员姓名" align="center" />
      <el-table-column prop="recoveryAge" label="年龄" align="center">
        <template slot-scope="scope">
          <sz-badge 
            :value="scope.row.recoveryAge+''" 
            :type="statusStyle(scope.row.recoveryAge)" 
            />
        </template>
      </el-table-column>
      <el-table-column prop="checkInfo" label="签到" align="center" />
      <el-table-column prop="signInfo" label="线上确认" align="center" />
    </page-table>
  </el-card>
</template>
  <script>
export default {
  name: "curriculumSignIn",
  data() {
    return {
      pageData: {},
      loading: false,
      searchDto: {
        keywords: null,
        pageSize: 10,
        pageIndex: 1,
        courseId:null,
      },
      switchValue: true,
    };
  },
  methods: {
    statusStyle(row){
      switch(row){
        case 6:
          return "warning";
        case 7:
          return "success";
        case 8:
          return "success";
      }
    },
    // 获取分页数据
    getPageData(val) {
      let tem = Object.assign(this.searchDto, val);
      if (this.$route.query.id) {
        this.searchDto.courseId = this.$route.query.id;
        this.API.getAllRecoveryPageListByCourseId(tem).then((ret) => {
          console.log('ret:',ret);
          this.pageData = ret.data;
        });
      }
    },

    // 查询
    search() {
      this.getPageData();
    },

    //清空
    clear() {
      this.$refs.form.resetFields();
      this.getPageData();
    },

    //不同年龄 样式不同
    aAgeStyle(row){

    },
    clickTestHandle(row){
      console.log('clickTestHandle:',row);
    }
  },
  mounted() {
    this.getPageData();
  },
};
</script>
<style scoped></style>